import React, { PureComponent } from "react";
import { View, Text, TextInput ,ProgressBarAndroid,ProgressViewIOS} from "react-native";
import styles from "./style";
import TopBar from "../../../components/topbar";
import RefreshableFlatList from 'react-native-refreshable-flatlist';
class Index extends PureComponent {
    constructor() {
        super();
        this.state = {
            user: null,
            data: null
        };
    }
    componentDidMount() {
        // let user = global.realm.objects("User").filtered('phone = "13452145875"');
        let user = [{id:1,name:"大的",phone:"123456"},{id:2,name:"小的",phone:"123456"},{id:3,name:"的的",phone:"123456"}];
        let data1= [];
        data1.push({
            id: user[0].id,
            name:user[0].name,
            phone: user[0].phone
        });
        data1.push({
            id: user[1].id,
            name:user[1].name,
            phone: user[1].phone
        });
        this.setState({
            user: user[0].name,
            data: data1,
            // 下拉刷新
            isRefresh:false,
            // 加载更多
            isLoadMore:false
        });
    }
    async _onPressItem (id: string) {
        let  s =await this.props.getListData(); //异步变同步标记 等待执行完 再执行下面代码
        // alert(s);
        // console.log(111)
        let {listData}=this.props;
        alert(JSON.stringify(listData));

        // let test = (resolve, reject) => {
        //     var timeOut = Math.random() * 2;
        //     setTimeout(function () {
        //         if (timeOut < 1) {
        //             resolve('200 OK');
        //         }
        //         else {
        //             reject('timeout in ' + timeOut + ' seconds.');
        //         }
        //     }, timeOut * 1000);
        // }
        // var p1 = new Promise(test);
        // var p2 = p1.then(function (result) {
        //     console.log('成功：' + result);
        // });
        // var p3 = p2.catch(function (reason) {
        //     console.log('失败：' + reason);
        // });
    };



    _renderItem = ({item}) => (
        <MyListItem
            id={item.id}
            onPressItem={this._onPressItem.bind(this)}
            title={item.name}
        />
    )
    _keyExtractor = (item, index) => item.id;

    render() {
        return (
            <View style={styles.pageBox}>
                <TopBar title = "首页"
                        leftIsVisible = {false}></TopBar>

                    <Text style={{zIndex:1000,backgroundColor:"#fff"}}>百度一下,你就知道了</Text>
                    <View style={{zIndex:100,backgroundColor:"#fff"}}>
                        <View style={{padding: 10,flexDirection: 'row'}}>
                            <TextInput
                                style={{height: 40}}
                                onChangeText={(text) => this.setState({text})}
                            />
                            <Text>搜索{JSON.stringify(this.state.data)}</Text>
                        </View>
                        <Text>你好{this.state.user}</Text>
                    </View>

                    <View style={styles.pageBox}>
                        <RefreshableFlatList
                            data={[{id: '1',name: '小明'}, {id: '2',name: '小德'},{id: '3',name: '小发'}]}
                            renderItem={this._renderItem}
                            topIndicatorComponent = { () =><ProgressBarAndroid color='red'/>}
                            bottomIndicatorComponent = { () =><ProgressBarAndroid color='red'/>}
                            // ref={(ref) => { this.flatList = ref}}
                            topPullingPrompt = "下拉刷新"
                            topRefreshingPrompt = "刷新中..."
                            topHoldingPrompt = "下拉刷新"
                            bottomPullingPrompt = "上拉加载"
                            bottomRefreshingPrompt = "加载中..."
                            bottomHoldingPrompt = "上拉加载"
                            onRefreshing={this._onRefresh}
                            onLoadMore={this._onLoadMore}
                            keyExtractor={item => item.id}
                            styles={{ prompt: { color: 'gray' } }}
                        />
                    </View>
            </View>
        );
    }

    _onRefresh() {
        return new Promise((r)=>{
            setTimeout(()=>{
                r();
            },1000)
        })
    }
    _onLoadMore() {
        return new Promise((r)=>{
            setTimeout(()=>{
                r();
            },1000)
        });
    }

    /**
     * 创建头部布局
     */
    _createListHeader(){
        return (
            <View style={styles.headView}>
                <Text style={{color:'white'}}>
                    头部布局
                </Text>
            </View>
        )
    }

    /**
     * 创建尾部布局
     */
    _createListFooter(){
        return (
            <View style={styles.footerView}>
                <Text style={{color:'white'}}>
                    底部底部
                </Text>
            </View>
        )
    }
}

class MyListItem extends PureComponent {
    _onPress = () => {
        this.props.onPressItem(this.props.id);
    };

    render() {
        return (
            <View>
                <Text onPress={this._onPress}
                >你好{this.props.title}</Text>
            </View>
        )
    }
}
export default Index;
